<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/commons/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
	<head>
		<title>北京车辆段</title>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

		<script type="text/javascript" src="${ctx}/scripts/jquery-1.4.2.min.js"></script>
		<link href="${ctx}/css/sheying.css" rel="stylesheet" type="text/css" />
		<script type="text/javascript" src="${ctx}/scripts/jquery.pagination.js"></script>
		<script type="text/javascript" src="${ctx}/scripts/collection.js"></script>
		<link href="${ctx}/css/index.css" rel="stylesheet" type="text/css" />
      
 <script type="text/javascript">
        var iTimeoutIdB=""; 
		var indexB=0; //默认第一个显示的图片的索引
		var showTimeB=4000; //显示时间（单位：毫秒）
		var img_VanishTimeB=500; //逐渐显示的时间（单位：毫秒） 

		 var iTimeoutId=""; 
		 var index=0; //默认第一个显示的图片的索引
		 var showTime=4000; //显示时间（单位：毫秒）
		 var img_VanishTime=500; //逐渐显示的时间（单位：毫秒）
		 var t = n = count = 0;
		 $(document).ready(function() {  
		      initData(); //初始菜单 标题 天气预报、安全天数等信息 
              initSafHb();//左侧图标
              initXW();    //初始行文系统
              
<c:if test="${param.xw==null||param.xw==''}">          
			  dosearch('<%=request.getParameter("newskeyword")%>','<%=request.getParameter("categoryid")%>');
</c:if>

		 });  	
	  </script>
     	<script type="text/javascript">
     	   function search(){ 
     	     	 document.form1.method = "post";
				 document.form1.action = "${ctx}/web/Web/listNews.do?categoryid=";
				 document.form1.submit();
     	  
     	   }
     	   function viewNews(id){
             window.location="${ctx}/web/Web/showNews.do?newsid="+id;     	
     	   }
     	  function dosearch(nkw,cd){    
     	  	   $.get("${ctx}/web/Web/listAjaxNews.do?"+Math.random(), {
                 Action:"get",newskeyword:encodeURIComponent(nkw),catId:cd}, function (data, textStatus){	
                  var  jsonData = eval("["+data+"]");                 
                  var totalsize = jsonData[0].total;
                  var lidata = jsonData[0].rows;
                  var title = '';
          		  if( totalsize > 0){
          		    $('#list_result_content ul').html("");
       			 	for(var k = 0 ; k < totalsize; k++){          			       	          		
          			 $('#list_result_content ul').append('<li class="show"><span style="position:absolute;right:180px;">'+lidata[k].createTimeString+'</span><a href="javascript:viewNews(\''+lidata[k].id+'\');">'+lidata[k].title+'</a></li>');
          		  }  
          		    
               		  		 
        	   }  		
		$(function(){
		//总数目
		var length = $("#list_result_content .show").length;
		 
       
		//从表单获取分页元素参数
		var optInit = getOptionsFromForm();
		$("#list_fenye").pagination(length, optInit);
	
	
	//-----------------------------------
	function getOptionsFromForm(){
		var opt = {callback: pageselectCallback, 
		prev_text:'前一页　',
 		next_text:'　后一页'};
		// 从文本域中收集参数 - 这些空间名与参数名相对应
		$("input:text").each(function(){
			opt[this.name] = this.className.match(/numeric/) ? parseInt(this.value) : this.value;
		});
		//避免demo重引入HTML
		var htmlspecialchars ={ "&":"&amp;", "<":"&lt;", ">":"&gt;", '"':"&quot;"}
		$.each(htmlspecialchars, function(k,v){
			opt.prev_text = opt.prev_text.replace(k,v);
			opt.next_text = opt.next_text.replace(k,v);
		})
		return opt;
		}
	//-------------------------------
	function pageselectCallback(page_index, jq){
		// 从表单获取每页的显示的列表项数目
		var items_per_page = 40;
		var max_elem = Math.min((page_index+1) * items_per_page, length);
		
		$("#list_content ul").html("");
		// 获取加载元素
 
		for(var i=page_index*items_per_page;i<max_elem;i++){

		
		 $("#list_content ul").append($("#list_result_content .show:eq("+i+")").clone());
	

		}

		//阻止单击事件
		return false;
	}
	});

		});		
     	  
   }
     	  

	    </script>
	</head>

 <body>
 <div class="box">
	 <div class="top">
    	<div class="Tright"><a href="#">收藏本页</a><span>|</span><a href="#">设为首页</a></div>
        您好，欢迎光临北京车辆段！
    </div> 
	 <div class="top_img">   	
		<div class="column">
         <div class="photo" id="photo">
          <ul class="clear" id="photo-sub" style="width:2944px;height:200px">
           <li><a href="#" title="图片说明一" target="_blank"><img src="${ctx}/images/web/qj3.jpg" /></a></li>
            <li><a href="#" title="图片说明一" target="_blank"><img src="${ctx}/images/web/qj1.jpg" /></a></li>
           <li><a href="#" title="图片说明一" target="_blank"><img src="${ctx}/images/web/qj.jpg" /></a></li>
           <li><a href="#" title="图片说明一" target="_blank"><img src="${ctx}/images/web/qj1.jpg" /></a></li>
          </ul>
         </div>
        </div>	
    </div>  
    <script type="text/javascript" src="${ctx}/scripts/lunbo.js"></script>
    <div class="logo_box">
    	<div class="logo"><a href="#"><img src="${ctx}/images/web/logo.jpg" /></a></div>
        <div id="logo_middle" class="logo_middle">
         
            
            <div class="clear"></div>
        </div>
        <div class="logo_tq">
        	 
            <div id="weather">
             
            </div>
            <div class="clear"></div>
        </div>
        <div class="clear"></div>
    </div>
    <div class="nav_box">
    	<ul id="nav">
          
		</ul>
    </div>
    <div class="login_box">
         
    	<div class="login">
        <form id="forms" action="${ctx}/web/Web/webLogin.do" method="post">
          <c:if test="${sessionScope.username==null||sessionScope.username==''}" >
            用户名：<input name="userName" type="text" class="shurubox" />
            密码：<input name="userPwd" type="password" class="shurubox" />
          <input type="button" onclick="login()" value="立即登录" class="liji" />
          </c:if>
           <c:if test="${sessionScope.username!=null&&sessionScope.username!=''}" >
                您好!&nbsp;${sessionScope.username}  
                 &nbsp;<a  href="${ctx}/web/Web/webLogout.do" style="color:#6c6c6c;cursor:pointer;"> [退出] </a>
				 <a href="javascript:openpwd();" style="color:#6c6c6c;cursor: pointer;"  >[修改密码] </a>
           </c:if>
          <c:if test="${requestScope.result!=null&&requestScope.result!=''}" >
			 <script type="text/javascript" >
			     alert('${requestScope.result}'); 
			 </script>
		 </c:if> 
          </form>
      
        </div>
        <div class="login_search">
       <form name = "form1">
        	  <input type="text" name="newskeyword" value="请输入搜索关键字" class="search_box"  onfocus="if(value =='请输入搜索关键字'){value =''}" onblur="if (value ==''){value='请输入搜索关键字'}"/><input type="button" class="search_but" value="" onclick = "javascript:search();"/>
      </form>
        </div>
        <div class="clear"></div>
    </div>
    <div class="content">
    	<div class="left">
    	<div class="left_nrbox">
            	<div class="left_nrbox_title">安全天数</div>
                <div class="left_nrbox_center" align="center">
					<div class="mbottom">
                    <span> <div id="safe1"  style="width:50px;"></div> </span>
                    <table id="safe1Table" width="93" border="0" style="background:url(${ctx}/images/web/time_bg.jpg) no-repeat; height:37px; text-align:center; float:left; vertical-align:middle;;font-size:19px;font-weight:bold"> 
                        
                    </table>
                    <span>天</span>
                    <div class="clear"></div>
                    </div>
                    <div class="mbottom">
                    <span> <div id="safe2"  style="width:50px;"></div> </span>
                    <table id="safe2Table" width="93" border="0" style="background:url(${ctx}/images/web/time_bg.jpg) no-repeat; height:37px; text-align:center; float:left; vertical-align:middle;font-size:19px;font-weight:bold"> 
                      
                    </table>
                    <span>天</span>
                    <div class="clear"></div>
                    </div>
                    <div class="mbottom">
                    <span> <div id="safe3" style="width:50px;"></div> </span>
                    <table id="safe3Table" width="93" border="0" style="background:url(${ctx}/images/web/time_bg.jpg) no-repeat; height:37px; text-align:center; float:left; vertical-align:middle;;font-size:19px;font-weight:bold"> 
                       
                    </table>
                    <span>天</span>
                    <div class="clear"></div>
                    </div>
                    <div class="clear"></div>
                </div>
            </div>
            <div class="left_nrbox" style="height:310px;" >
			    
            	<div class="left_nrbox_title"  >未签收通报</div> 
                <div class="left_nrbox_center" >
              <MARQUEE id="newsList" onmouseover=this.stop() onmouseout=this.start() 
                  scrollAmount=1 scrollDelay=30 direction=up   	>
                  
                 </MARQUEE>
                </div>
            </div>
             <div id="left_biaoti" class="left_biaoti">
            	 
            </div>
            <div class="left_grb"><a href="${ctx}/web/Web/getNewsByTitle.do?title=grb"><img src="${ctx}/images/web/grb.jpg" /></a></div>
            <div class="left_grb"><a href="${ctx}/web/Web/getNewsByTitle.do?title=lgt"><img src="${ctx}/images/web/lgt2.jpg" /></a></div>
            <div class="left_nrbox" style="border:1px solid #d5d5d5;">
            	<div class="left_nrbox_title">安全宣传</div>
               <div class="safety_img">
                	<div class="lxfscroll" id="lxfscroll" >
                	   <ul>
                 
                      </ul>
                    
                    </div>
                </div>
            </div>
            <div class="left_nrbox" style="border:1px solid #d5d5d5;" >
            	<div class="left_nrbox_title">节能环保</div>
                <div class="safety_img">
                	<div class="wrapper">
                        <div id="focus">
	                        <ul>
                              
                            </ul> 
                        </div>
                    </div>
                </div>
			  </div>
            <div class="left_nrbox">
            	<div class="left_nrbox_title">友情链接</div>
            	
                <div class="safety_img link" style="heigth:70px" >
                    
                	<select >
                    	<option>请选择</option>
                    </select>
                    <select>
                    	<option>请选择</option>
                    </select>
                    <select>
                    	<option>请选择</option>
                    </select>
                    <input type="submit" value="" />
                </div>
            </div>
        </div>
		 <div class="right">
					<div class="right_yunshubox">
					
					
					<div class="right_yunshuboxL" style="margin-left:10px;">
    
				<div class="hb_content">
     <div class="hb_content_L">
    <c:forEach items="${requestScope.catList}" var="item"  varStatus="varStatus">
          <c:if test="${varStatus.count/1==(fn:length(requestScope.catList)/2+1)}" >  
                </div>
        		<div class="hb_content_R">
           </c:if>
            <c:if test="${item.caTypes=='TXT'}" >  
        	<div class="hb_Lnewsbox" >  
            	<div class="hb_Lnewstop">${item.names}</div>
                <ul>
                <c:if test="${item.newsList!=null}">
                     <c:forEach items="${item.newsList}" var="temp"> 
                	<li><span>[${temp.createTimeString}]</span><a href="#">${temp.title}</a></li> 
                	</c:forEach>
                </c:if>
                </ul>
              </div>
           </c:if>
            <c:if test="${item.caTypes=='IMG'}" >  
        	<div class="hb_cpzsbox">
            	<div class="hb_cpzsbox_title">${item.names}</div>
                <ul>
                <c:if test="${item.newsList!=null}">
                     <c:forEach items="${item.newsList}" var="temp">
                        <li> <a href="${ctx}${temp.fromUrl}"><p class="p_tu"><img src="${ctx}${temp.fromUrl}" height="135" width="116"/></p>
                    <span>${temp.title}</span></a></li> 
                   
                	</c:forEach>
                </c:if>
                </ul>
             </div>
           </c:if>
   </c:forEach>     
    </div>
      <div class="clear"></div>
        <br>
    </div>
			
						</div>
 						<div id="list_content" class="list_content" >
          			     <ul></ul>
           				</div>
           				
<c:if test="${param.xw==null||param.xw==''}">   
                          
						<div id="list_fenye" class="list_fenye"><!-- 这里显示分页 --></div>
</c:if>
						<div id="list_result_content" class="list_result_content" style="display:none">
           					<ul> 
                			</ul>
						</div>
					</div>
				</div>
				<div class="clear"></div>
			</div>

			<div class="footer">
				<ul>Copyright ©2011-2012 北京车辆段 版权所有</ul>
					 信息技术科 联系电话：010-51868237 
			</div>
		</div>
	</body>
</html>
<script>
function initData(){
     $.get('${ctx}/news/Menu/topList.do?t='+Math.random(), function(josn) {
         	 if(josn!=""){
		     josn = josn.replace(new RegExp("null","gm"),'""');
		     var mydata = eval("("+josn+")");
			     if(mydata.weather!=''){
			       var ojb=mydata.weather; 
			       var temp=ojb.names.replace(new RegExp("#","gm"),'<br>'); 
			       
			       document.getElementById("weather").innerHTML='<img src="${ctx}'+ojb.urls+'" height="50px"/>'+'<div>'+temp+'</div>';
			        
			   }
			  //  if(mydata.title!=''){ 
			  //     var ojb=mydata.title;
			  //     document.getElementById("title").innerHTML='<b>'+ojb.names+'</b>';
			       
			  // }
			    if(mydata.safe1!=''){
			       var ojb=mydata.safe1; 
			       document.getElementById("safe1").innerHTML=ojb.names;
			       if(ojb.createTimeString!=''){ 
			          var arr1 = ojb.createTimeString.split("-"); 
			           var dt1 = new Date(); 
						dt1.setFullYear(arr1[0]); 
						dt1.setMonth(arr1[1] - 1); 
						dt1.setDate(arr1[2]); 
						var dt2 = new Date(); 
						var dif = dt2.getTime() - dt1.getTime(); 
						var days =parseInt(dif / (24 * 60 * 60 * 1000))+''; 
						 
						var content='';
						for(var i=0;i<days.length;i++){
						
						   content+='<td>'+days.charAt(i)+'</td>';
						}
						if(days.length<4){
						   for(var i=0;i<4-days.length;i++){
						     content='<td>0</td>'+content;
						   }
						}
						content='<tr>'+content+'</tr>';
						$("#safe1Table").append(content);
			       }
			       
			         
			   }
			   if(mydata.safe2!=''){
			       var ojb=mydata.safe2; 
			       document.getElementById("safe2").innerHTML=ojb.names;
			       if(ojb.createTimeString!=''){
			         var arr1 = ojb.createTimeString.split("-"); 
			         var dt1 = new Date(); 
						dt1.setFullYear(arr1[0]); 
						dt1.setMonth(arr1[1] - 1); 
						dt1.setDate(arr1[2]); 
						var dt2 = new Date(); 
						var dif = dt2.getTime() - dt1.getTime(); 
						var days = parseInt(dif / (24 * 60 * 60 * 1000))+''; 
						 
						var content='';
						for(var i=0;i<days.length;i++){
						
						   content+='<td>'+days.charAt(i)+'</td>';
						}
						if(days.length<4){
						   for(var i=0;i<4-days.length;i++){
						     content='<td>0</td>'+content;
						   }
						}
						content='<tr>'+content+'</tr>';
						$("#safe2Table").append(content);
						
			       } 
			   }
			   if(mydata.safe3!=''){
			       var ojb=mydata.safe3; 
			       document.getElementById("safe3").innerHTML=ojb.names;
			       if(ojb.createTimeString!=''){
			          var arr1 = ojb.createTimeString.split("-"); 
			         var dt1 = new Date(); 
						dt1.setFullYear(arr1[0]); 
						dt1.setMonth(arr1[1] - 1); 
						dt1.setDate(arr1[2]); 
						var dt2 = new Date(); 
						var dif = dt2.getTime() - dt1.getTime(); 
						var days =parseInt(dif / (24 * 60 * 60 * 1000))+''; 
					 
						var content='';
						for(var i=0;i<days.length;i++){
						
						   content+='<td>'+days.charAt(i)+'</td>';
						}
						if(days.length<4){
						   for(var i=0;i<4-days.length;i++){
						     content='<td>0</td>'+content;
						   }
						}
						content='<tr>'+content+'</tr>';
						$("#safe3Table").append(content);
			       } 
			   }
			    if(mydata.menus!=''){
			      var ojb=mydata.menus;
			      var content='';
			      for(var i=0;i<ojb.length;i++){
			        if(ojb[i].urls==''){
			           ojb[i].urls='#';
			        } 
			        content+='<li>';
			        content+='<a href="'+ojb[i].urls+'">'+ojb[i].names+'</a>';
			        content+='<ul>';
			        content+='<li><a href="'+ojb[i].urls+'">'+ojb[i].names+'</a></li>';
                    if(ojb[i].childrenMenu!=''){
                        var children=ojb[i].childrenMenu;
 						for(var j=0;j<children.length;j++){ 
							content+='<li><a href="'+children[j].urls+'">'+children[j].names+'</a></li>';
						 }
						
			         }
			         content+='</ul>';
			         content+='</li>';
			         
			      }
			     // alert(content);
			      document.getElementById("nav").innerHTML=content;
			      menuFix();
			   }
			    if(mydata.topTitle!=''){
			      var ojb=mydata.topTitle;
			      var content='<dl>';
			      for(var i=0;i<ojb.length;i++){
			        if(i>0&&i%2==0){
			            content+='</dl><dl>';
			        }
					content+='<dd><a href="'+ojb[i].urls+'">'+ojb[i].names+'</a> </dd>';
				  }
			      content+=' <div class="clear"></div>'; 
			      document.getElementById("logo_middle").innerHTML=content;
			      
			     
			   } 
			   if(mydata.leftTitle!=''){
			      var ojb=mydata.leftTitle;
			       var content=''; 
			      for(var i=0;i<ojb.length;i++){ 
					content+='<a href="'+ojb[i].urls+'"  >'+ojb[i].names+'</a>  ';
				  }
			      document.getElementById("left_biaoti").innerHTML=content;
			   }
			}
			  
        }) ;  
       
   } 
   function initXW(){ //初始化行文
      
         //未签收文件
        $.ajax({
            url:'${ctx}/web/Web/getXW.do?t='+Math.random(),
            type: "Get",  
            data:'xwurls=http://10.78.109.30:8099/GetJosn.asmx/GetWeiQianShou',
            success:function (result) {
              var mydata = eval("("+result+")");  
              var content="<ul>";
              for(var p in mydata){ 
                 content+='<li style="background:url(${ctx}/images/web/left_dot.jpg) no-repeat left center;margin-bottom:10px;margin-left:14px;"><a style="font-size:12px; color:#8a2220;" href="http://10.78.109.30:8099/">'+mydata[p].DeptName+'('+mydata[p].Count+')'+'</a></li>';
		      }
		      content+="</ul>";              
		   	  document.getElementById("newsList").innerHTML=content;
		   	  
		   	  
		   	  
		   	  
            },
            error: function (e) {
               
            }
        });
 <c:if test="${param.xw!=null&&param.xw!=''}">      
          //段发文件
        $.ajax({
           url:'${ctx}/web/Web/getXW.do?num=20&t='+Math.random(),
            type: "Get",  
            data:'xwurls=http://10.78.109.30:8099/GetJosn.asmx/${param.xw}',
            success:function (result) {
              var mydata = eval("("+result+")"); 
               //alert(result);
                var content="<ul>";
              for(var p in mydata){   
                        			       	          		
          	      content+='<li class="show"><span style="position:absolute;right:180px;">'+mydata[p].DateTime+'</span><a href="http://10.78.109.30:8099/">'+mydata[p].Title+'</a></li>';
          		  
               } 
                content+="</ul>";   
                        
                document.getElementById("list_content").innerHTML=content;
                
            },
            error: function (e) {
               
            }
        });
</c:if>       
       
   }
 function initSafHb(){ //初始化左侧漫画
       $.get('${ctx}/news/News/getNewsByTitleAjax.do?title=safe&pNum=7&t='+Math.random(), function(josn) {
           var content="<ul>";
          if(josn!=""){
	          josn = josn.replace(new RegExp("null","gm"),'""');
	          var mydata = eval("("+josn+")"); 
	          for(var p in mydata){  
	             var cat=mydata[p];  
	             
		         if(cat.caTypes=='IMG'){
		      
			          var ojbs=cat.newsList;
					  for(var i=0;i<ojbs.length;i++){
					  	  var temp=ojbs[i];
						  if(i>=5){
				             	  break;
				           }
							//<img src="${ctx}'+temp.fromUrl+'"  width="200" height="200" />
				        content+=' <li><a href="${ctx}/web/Web/getNewsByTitle.do?title=safe" ><img src="${ctx}'+temp.fromUrl+'" width="170" height="200" /></a></li>';
              		   }   	
			       }     
		       }
	        }
	        content+='</ul>';
	          
           document.getElementById("lxfscroll").innerHTML=content;
           
           //滚动
		    var ul = $(".lxfscroll ul");
			var li = $(".lxfscroll li");
			var tli = $(".lxfscroll-title li");	
			var len = $("#lxfscroll ul li").length; //获取焦点图个数
			var speed = 350;
			var autospeed = 3000;	
			var i=1;
			var index = 0;
			var n = 0;
		    /* 标题按钮事件 */
			function lxfscroll() {
						var index = tli.index($(this));					
						tli.removeClass("cur");
						$(this).addClass("cur");
						
						ul.css({"left":"0px"});	
						li.css({"left":"0px"}); 
						li.eq(index).css({"z-index":i});	
						li.eq(index).css({"left":"200px"});	
						ul.animate({left:"-200px"},speed); 	
						i++;	
					
		    };
			/* 自动轮换 */
			function autoroll() {
					if(n >=len) {
						n = 0;
					}
					tli.removeClass("cur");
				    tli.eq(n).addClass("cur");
					ul.css({"left":"0px"});	
				    li.css({"left":"0px"}); 
				    li.eq(n).css({"z-index":i});	
				    li.eq(n).css({"left":"200px"});	
				 	
					n++;
					i++;
					timer = setTimeout(autoroll, autospeed);
					ul.animate({left:"-200px"},speed);
				};
			/* 鼠标悬停即停止自动轮换 */
			 function stoproll() {
							li.hover(function() {
								clearTimeout(timer);
								n = $(this).prevAll().length+1;
							}, function() {
								timer = setTimeout(autoroll, autospeed);
							});
							tli.hover(function() {
								clearTimeout(timer);
								n = $(this).prevAll().length+1;
							}, function() {
								timer = setTimeout(autoroll, autospeed);
							});
			 };			
			tli.mouseenter(lxfscroll);
			autoroll();
			stoproll();  
			 
        });       
   		$.get('${ctx}/news/News/getNewsByTitleAjax.do?title=hb&pNum=7&t='+Math.random(), function(josn) {
   		    var content="<ul>";
          if(josn!=""){
	          josn = josn.replace(new RegExp("null","gm"),'""');
	          var mydata = eval("("+josn+")"); 
	          for(var p in mydata){  
	             var cat=mydata[p];  
		         if(cat.caTypes=='IMG'){
			          var ojbs=cat.newsList;
					  for(var i=0;i<ojbs.length;i++){
					  	  var temp=ojbs[i];
						  if(i>=5){
				             	  break;
				           }
				           content+='<li>';
                           content+='<div style="left:0; top:0; width:200px; height:200px;"><a href="${ctx}/web/Web/getNewsByTitle.do?title=hb" ><img src="${ctx}'+temp.fromUrl+'" width="170" height="200" /></a></div>';                
                           content+='</li>';
				       }   	 
		          }     
		       }
	        }
	        content+='</ul>'; 
           document.getElementById("focus").innerHTML=content;
           
           var sWidth = $("#focus").width(); //获取焦点图的宽度（显示面积）
			var len = $("#focus ul li").length; //获取焦点图个数
			var index = 0;
			var picTimer;
			
			//以下代码添加数字按钮和按钮后的半透明长条
			var btn = "<div class='btnBg'></div><div class='btn'>";
			for(var i=0; i < len; i++) {
				btn += "<span></span>";
			}
			btn += "</div>" 
			$("#focus").append(btn);
			$("#focus .btnBg").css("opacity",0.5); 
			//本例为左右滚动，即所有li元素都是在同一排向左浮动，所以这里需要计算出外围ul元素的宽度
			$("#focus ul").css("width",sWidth * (len + 1));
			
			//鼠标滑入某li中的某div里，调整其同辈div元素的透明度，由于li的背景为黑色，所以会有变暗的效果 
			//鼠标滑上焦点图时停止自动播放，滑出时开始自动播放
			$("#focus").hover(function() {
				clearInterval(picTimer);
			},function() {
				picTimer = setInterval(function() {
					if(index == len) { //如果索引值等于li元素个数，说明最后一张图播放完毕，接下来要显示第一张图，即调用showFirPic()，然后将索引值清零
						showFirPic();
						index = 0;
					} else { //如果索引值不等于li元素个数，按普通状态切换，调用showPics()
						showPics(index);
					}
					index++;
				},3000); //此3000代表自动播放的间隔，单位：毫秒
			}).trigger("mouseleave");
			
			//显示图片函数，根据接收的index值显示相应的内容
			function showPics(index) { //普通切换
				var nowLeft = -index*sWidth; //根据index值计算ul元素的left值
				$("#focus ul").stop(true,false).animate({"left":nowLeft},500); //通过animate()调整ul元素滚动到计算出的position
				$("#focus .btn span").removeClass("on").eq(index).addClass("on"); //为当前的按钮切换到选中的效果
			}
			
			function showFirPic() { //最后一张图自动切换到第一张图时专用
				$("#focus ul").append($("#focus ul li:first").clone());
				var nowLeft = -len*sWidth; //通过li元素个数计算ul元素的left值，也就是最后一个li元素的右边
				$("#focus ul").stop(true,false).animate({"left":nowLeft},500,function() {
					//通过callback，在动画结束后把ul元素重新定位到起点，然后删除最后一个复制过去的元素
					$("#focus ul").css("left","0");
					$("#focus ul li:last").remove();
				}); 
				$("#focus .btn span").removeClass("on").eq(0).addClass("on"); //为第一个按钮添加选中的效果
			}
		        }); 
		   }
		   function initPhoto(){
		
		      $.get('${ctx}/files/Files/listAjax.do?fileTypes=PHOTO&t='+Math.random(), function(josn) {
		          var content="<ul>";
		          if(josn!=""){
		            var mydata = eval("("+josn+")");
		             var ojbs=mydata.rows;             
					 for(var i=0;i<ojbs.length;i++){ 		
					   var temp=ojbs[i];
		               content+='<li><a href="" title=""><img src="${ctx}'+temp.ctxpaths+'"  width="146" height="111"/><span>'+temp.names+'</span></a></li>';
		             
		             }
		          }
		          if(content=="<ul>") {
		             
		             content+="<li></li>";
		          }
		          content+="</ul>";
		          
		         document.getElementById("box2").innerHTML=content;
		         
		         if(ojbs.length>4){
			         //图片滚动
			         $("#box2").jCarouselLite({
			                btnPrev: "#prev2",
			                btnNext: "#next2",
			                auto: 5000, //图片停留时间
			                scroll: 1, //每次滚动覆盖的图片个数
			                speed: 200, //设置速度，0是不动。其次就是数字越大 ，移动越慢。
			                vertical: false, //横向（true），竖向（false）
			                visible:5, //显示的数量
			                circular: true //是否循环
			         });
		         }
		         //滚动结束
     }) ;  
       
   }
   
   function login(){  
        $('#forms').submit();
    }
   function playB()
    {
        $("#playB").fadeOut(img_VanishTimeB,function(){
            if(indexB!=$("#imglistboxB div").length-1)
            {
                indexB++;
            }else
                indexB=0;
            if(indexB==0)
            {
                $(".flash_bottom_rightB").find("div").last().removeClass("jiaodianB");
            }else
            {
                $(".flash_bottom_rightB").find("div").eq(indexB-1).removeClass("jiaodianB");
            }
            $("#playB").hide();
            $("#playB").attr({src:$(".ul2").find("div").eq(indexB).find("img").attr("src"),
                            alt:$(".ul2").find("div").eq(indexB).find("img").attr("alt")});
            $(".flash_topB").find("a").eq(0).attr({href:$(".ul1").find("div").eq(indexB).find("a").eq(0).attr("href")});
            $(".flash_bottom_rightB").find("div").eq(indexB).addClass("jiaodianB");
            $("#playB").fadeIn(img_VanishTimeB);
        });
    }
      function play()
    {
        $("#play").fadeOut(img_VanishTime,function(){
            if(index!=$("#imglistbox div").length-1)
            {
                index++;
            }else
                index=0;
            if(index==0)
            {
                $(".flash_bottom_right").find("div").last().removeClass("jiaodian");
            }else
            {
                $(".flash_bottom_right").find("div").eq(index-1).removeClass("jiaodian");
            }
            $("#play").hide();
            $("#play").attr({src:$(".ul1").find("div").eq(index).find("img").attr("src"),
                            alt:$(".ul1").find("div").eq(index).find("img").attr("alt")});
            $(".flash_top").find("a").eq(0).attr({href:$(".ul1").find("div").eq(index).find("a").eq(0).attr("href")});
            $(".flash_bottom_right").find("div").eq(index).addClass("jiaodian");
            $("#play").fadeIn(img_VanishTime);
        });
    }
    function menuFix() { 
	 var sfEls = document.getElementById("nav").getElementsByTagName("li");
	 for (var i=0; i<sfEls.length; i++) {
		  sfEls[i].onmouseover=function() {
		  var ul = this.getElementsByTagName("ul")[0];
			  if(ul){
			      ul.style.display = "block";
				  this.className+=(this.className.length>0? " ": "") + "sfhover";
			  }
		  }
		  sfEls[i].onmouseout=function() {
		  		var ul = this.getElementsByTagName("ul")[0];
			  if(ul){
			      ul.style.display = "none";
			  	   this.className+=(this.className.length>0? " ": "") + "sfhover";
			  }
		  }
	 
 }

} 
</script>